<template>
	<view>
		<view style="padding-bottom: 160rpx;">
			<view style="height: 102rpx;width: 710rpx;margin-left: 40rpx;border-bottom: 2rpx solid #E5E5E5; display: flex;">
				<view style="color: #1372F5;font-size: 32rpx;padding-top: 35rpx;" @click="yinzhou()" v-if="userId=='330212'">鄞州区</view>
				<view style="color: #1372F5;font-size: 32rpx;padding-top: 35rpx;" @click="yinzhou()" v-else>{{userName}}</view>
				<view style="margin-left: 20rpx;padding-top: 30rpx;" v-if="active1">-</view>
				<view style="margin-left: 20rpx;padding-top: 35rpx;font-size: 32rpx;color:#1372F5;" v-if="active1">{{jiedao}}</view>
				<view></view>
				
			</view>
			<!-- <view style="margin-left: 42rpx;">
				<view style="font-size: 28rpx;margin-top: 40rpx;"
				@click="light(index,item.id)"  
				:class="active===index?'active':''" 
				v-for="(item,index) in cate" 
				:key="item.id">{{item.name}}<image src="../../static/对号.png" style="margin-left:46rpx;width: 27rpx;height: 21rpx;" v-if="active1"></image></view>

			</view>	 -->
			<view style="margin-left: 42rpx;">
				<view style="font-size: 28rpx;margin-top: 40rpx;"
				@click="light(index,item.name,item.id)"  
				:class="active===index?'active':''" 
				v-for="(item,index) in cate" 
				:key="item.id">{{item.name}}
				<image v-if="active===index" src="../../static/对号.png" style="margin-left:46rpx;width: 27rpx;height: 21rpx;" ></image>
				</view>
			</view>	
		</view>	
		<view style="height: 140rpx;width: 750rpx;position: fixed;bottom: 0;border-top: 2rpx solid #E5E5E5;background-color: #fff;">
			<button style="width: 690rpx;height: 94rpx;display: flex;flex-direction: row;justify-content: center;background-color: #519AFF;border-radius: 47rpx;margin-top: 14rpx;color: #FFFFFF;" @click="goto1()">确定</button>
		</view>
		<custom-tab-bar></custom-tab-bar>
	</view>
</template>
<script>
	export default{
		data(){
			return{
				cate:[],
				active:'',
				active1:false,
				jiedao:'',
				ins:'',
				name:'',
				userId:'',
				areaId:'',
				userName:''
			}
		},
		methods:{
			async getName(){
				this.$myRequest({
					url:'/project_flood/v1/region/select',
					data:{"userId":this.userId,"level":5}
				}).then((res)=>{
					this.cate = res.data.data.children
					console.log(this.cate);
					this.active=this.cate.findIndex((value)=>value.name==this.jiedao)
				})
			},
			light(index,name,id){
				this.active=index,
				this.active1=true,
				this.jiedao=name,
				this.id=id
			},
			yinzhou(){
				this.jiedao=this.userName,
				this.active='0'
				this.id=this.areaId
			},
			goto1(jiedao){
				uni.redirectTo({
					url:`list?jiedao=${this.jiedao}&name=${this.name}&id=${this.id}`
				})
				// uni.setStorage({
				// 	key:'jiedao',
				// 	data: this.jiedao
				// })
			}
		},
		onLoad(options) {
			try {
				const Y = uni.getStorageSync('userId');
				this.userId=Y;
			    if (Y) {
			        // console.log(X);
			    }
				
			} catch (e) {
			    // error
			}
			try {
				const X = uni.getStorageSync('areaId');
				this.areaId=X;
			    if (X) {
			        // console.log(X);
			    }
				
			} catch (e) {
			    // error
			}
			try {
				const Z = uni.getStorageSync('userName');
				this.userName=Z;
			    if (Z) {
			        // console.log(X);
			    }
				
			} catch (e) {
			    // error
			}
			this.jiedao=options.jiedao
			this.name=options.name
			console.log(options);
			if(this.jiedao!='undefined'){
				this.active1=true
			}
			
		},
		onShow() {
			this.getName()
		}
	}
</script>
<style>
	.active{
		color: #1372F5;
	}
</style>
